<template>
    <div>
        <el-select v-model="deptId" :placeholder="placeholder" clearable style="width: 100%;" @change="deptChange">
            <el-option
                v-for="item in deptList"
                :key="item.deptId"
                :label="item.deptName"
                :value="item.deptId">
            </el-option>
        </el-select>
    </div>
</template>

<script>

import {listDept} from '@/api/system/dept'

export default {
    name: "deptList",
    data() {
        return {
            // // 科室id
            // deptId: '',
            // 科室集合
            deptList: []
        }
    },
    props: {
        placeholder: {
            type: String,
            default: "请选择科室"
        },
        // 科室属性
        deptAttributeStr: {
            type: String,
            default: ""
        },
        // 门诊住院属性集合
        clinicVsVisitStr: {
            type: String,
            default: ""
        },
        // 机构id
        orgId: {
            type: String,
            default: ''
        },
        // 科室id
        deptId: {
            type: String,
            default: ''
        }

    },
    watch: {
        'orgId': function (val) {
            this.getDeptList()
        },
    },
    mounted() {
        this.getDeptList()
    },
    methods: {
        // 获取科室集合
        getDeptList() {
            let queryParams = {
                deptAttributeArray: this.stringToArray(this.deptAttributeStr, ","),
                clinicVsVisitArray: this.stringToArray(this.clinicVsVisitStr, ","),
                orgId: this.orgId
            }
            listDept(queryParams).then(res => {
                this.deptList = res.data
            })
        },
        /**
         * 字符串转数组
         * @param str 字符串
         * @param separatorTag 分隔符
         * @returns {*}
         */
        stringToArray(str, separatorTag) {
            if (typeof (str) == 'string' && str.length > 0) {
                return str.split(separatorTag)
            }
            return ""
        },
        // 点击事件
        deptChange(value) {
            let deptInfo = {}
            let index = this.deptList.findIndex(item => {
                return item.deptId === value
            })
            if (index > -1) {
                deptInfo = this.deptList[index]
            }
            this.$emit("deptChange", deptInfo)
        }
    }
}
</script>

<style scoped>

</style>
